<template>
  <ant-modal
    modalWidth="576"
    modalHeight="500"
    :visible="open"
    :modal-title="formTitle"
    :adjust-size="true"
    @cancel="cancel"
  >
    <a-form-model ref="form" :model="form" :rules="rules" slot="content" layout="vertical">
      <a-row :gutter="32">
        <a-col :span="24" >
          <a-form-model-item label="客户" prop="customerId">
            <a-select
              placeholder="请选择客户"
              v-model="form.customerId"
              :getPopupContainer="
                triggerNode => {
                  return triggerNode.parentNode || document.body
                }
              "
              style="width: 100%"
              allow-clear
              show-search
              optionFilterProp="children"
            >
              <a-select-option v-for="(d, index) in customerIdOptions" :key="index" :value="d.id">{{ d.customerName }}</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
<!--        <a-col :span="24">-->
<!--          <a-form-model-item label="客户名称" prop="customerName">-->
<!--            <a-input v-model="form.customerName" placeholder="请输入客户名称"/>-->
<!--          </a-form-model-item>-->
<!--        </a-col>-->
        <a-col :span="24">
          <a-form-model-item label="期初应收金额" prop="totalAmount">
            <a-input-number v-model="form.totalAmount"  style="width: 100%"/>
          </a-form-model-item>
        </a-col>
<!--        <a-col :span="24">-->
<!--          <a-form-model-item label="期初已收金额" prop="collectionlAmount">-->
<!--            <a-input-number v-model="form.collectionlAmount" :min="0" style="width: 100%"/>-->
<!--          </a-form-model-item>-->
<!--        </a-col>-->
      </a-row>
    </a-form-model>
    <template slot="footer">
      <a-button :disabled="disabled" @click="cancel">
        取消
      </a-button>
      <a-button type="primary" :disabled="disabled" @click="submitForm(true)">
        保存
      </a-button>
    </template>
  </ant-modal>
</template>
<script>
import BizCustomerOpeningAddForm from './BizCustomerOpeningForm'
export default {
  ...BizCustomerOpeningAddForm
}
</script>
<style lang="less" scoped>
  .table-operations, body tr.ant-table-expanded-row:hover .table-operations {
    padding-bottom: 8px;
    text-align: right;
  }
  .table-operations {
    margin-bottom: 16px;
  }
  .table-operations > button,
  .table-operations .ant-input-affix-wrapper{
    margin-right: 8px;
  }
  .table_title {
    float: left;
    padding-left: 8px;
    font-weight: 600;
    color: #222222;
    line-height: 30px;
  }
</style>
